@extends('admin.master')

@section('style')
	<link rel="stylesheet" href="{{ url('css/bootstrap-datetimepicker.css') }}">
@endsection

@section('top')
<div class="top-breadcrumb pull-left">{!! Breadcrumbs::render('order-edit', $data, $u) !!}</div>
@endsection

@section('content')
	<div class="container-body" id="view">
	{!! Form::model($data, ['route' => ['admin.order.update', $data->id], 'method'=>'patch', 'class'=>'form-horizontal form-combine']) !!}
		<input name="referer" type="hidden" value="{{ request()->header('referer') }}">
		<div class="section-tab tab-view mt5">
			<ul class="nav nav-tabs">
				<li class="active"><a href="#tab-1">进度跟进</a></li>
				<li><a href="#tab-2">订单信息</a></li>
				<li><a href="#tab-3">客户信息</a></li>
			</ul>
			<div class="tab-content mt15">
				<div class="tab-pane active" id="tab-1">
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">设计师：</label>
						<div class="col-sm-8 row">
						    {!! Form::select("designer_id", ['-- 设计师 --'] + $designers->toArray(), $data->designer_id, ['class'=>'form-control len150']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">签单时间：</label>
						<div class="col-sm-8 row">
							<div class="input-append date form-datetime len150">
								{!! Form::text('signed_at', $data->signed_at->format('Y-m-d'), ['class'=>'form-control len150 datetimepicker-1', 'data-date-format'=>'yyyy-mm-dd']) !!}
								<i class="icon icon-date"></i>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">实际开始时间：</label>
						<div class="col-sm-8 row">
							<div class="form-datetime len150">
								{!! Form::text('actualed_at', $data->actualed_at->format('Y-m-d'), ['class'=>'form-control len150 datetimepicker-2', 'data-date-format'=>'yyyy-mm-dd']) !!}
								<i class="icon icon-date"></i>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">完成时间：</label>
						<div class="col-sm-8 row">
							<div class="form-datetime len150">
								{!! Form::text('finished_at', ($data->finished_at == '-0001-11-30 00:00:00' || $data->finished_at == '0000-00-00 00:00:00') ? '' : $data->finished_at->format('Y-m-d'), ['class'=>'form-control len150 datetimepicker-2', 'data-date-format'=>'yyyy-mm-dd']) !!}
								<i class="icon icon-date"></i>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">备案状态：</label>
						<div class="col-sm-8 row">
							{!! Form::select("icp_status", config('system.icp_status'), null, ['class'=>'form-control len150']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">进度：</label>
						<div class="col-sm-8 row">
							{!! Form::select('status', config('system.order_status'), null, ['class'=>'form-control len150']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">备注：</label>
						<div class="col-sm-8 row">
							{!! Form::textarea('remark', null, ['class'=>'form-control len500', 'rows'=>5]) !!}
						</div>
					</div>
				</div>
				<div class="tab-pane" id="tab-2">
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">网站类型：</label>
						<div class="col-sm-8 row">
							{!! Form::select('product', config('system')['product'][2], null, ['class'=>'form-control len150']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">业务员：</label>
						<div class="col-sm-8 row">
							{!! Form::hidden('saler_id', null, ['v-model'=>'saler']) !!}
							<div class="input-place len150" id="saler-select">
								<span class="filter-option pull-left" v-cloak>@{{ name ? name : '选择业务员' }}</span>
								<span class="bs-caret"><span class="caret"></span></span>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">服务年限：</label>
						<div class="col-sm-8 row">
							{!! Form::number('year', null, ['class'=>'form-control len150','data-rule'=>'required;integer(+0)']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">合同号：</label>
						<div class="col-sm-8 row">
							{!! Form::text('contract_no', null, ['class'=>'form-control len','placeholder'=>'请输入合同编号', 'readonly']) !!}
							<div class="contract-no-tip">
								<span class="contract-no-info">可用合同号：</span>
								<p class="contract-no-list label-list">
									<img src="{{ url('images/loading-1.gif') }}">
								</p>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">产品明细：</label>
						<div class="col-sm-8 row">
							{!! Form::text('product_detail', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">域名：</label>
						<div class="col-sm-8 row">
							<div class="input-group">
								<div class="input-group-addon">http://</div>
								{!! Form::text('domain', null, ['class'=>'form-control']) !!}
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">关键词：</label>
						<div class="col-sm-8 row">
							{!! Form::text('keywords', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">总金额：</label>
						<div class="col-sm-8 row">
							{!! Form::text('amount', null, ['class'=>'form-control len', 'data-rule'=>'required']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">订单金额：</label>
						<div class="col-sm-8 row">
							{!! Form::text('real_amount', null, ['class'=>'form-control len', 'data-rule'=>'required']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">尾款：</label>
						<div class="col-sm-8 row">
							{!! Form::text('tail_amount', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
				</div>				
				<div class="tab-pane" id="tab-3">
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">
							<span class="text-danger">*</span> <span>客户名称：</span>
						</label>
						<div class="col-sm-6 row">
							{!! Form::text('customer', $data->customer->name, ['class'=>'form-control len', 'disabled']) !!}
							<div class="checkbox input-right">
								<label>{!! Form::checkbox('expedited', 1, null) !!} 加急</label>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">联系人：</label>
						<div class="col-sm-8 row">
							{!! Form::text('contact_people', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">手机号：</label>
						<div class="col-sm-8 row">
							{!! Form::text('phone', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">座机：</label>
						<div class="col-sm-8 row">
							{!! Form::text('tel', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">传真：</label>
						<div class="col-sm-8 row">
							{!! Form::text('fax', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">邮编：</label>
						<div class="col-sm-8 row">
							{!! Form::text('zip_code', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width">邮箱：</label>
						<div class="col-sm-8 row">
							{!! Form::text('email', null, ['class'=>'form-control len']) !!}
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width"><span class="text-danger">*</span> 所在地区：</label>
						<div class="col-sm-8 row">
							<div class="block-inline" data-toggle="distpicker">
								<select name="city[province]" class="form-control" data-province="{{ $data->city['province'] }}"></select>
								<select name="city[city]" class="form-control" data-city="{{ $data->city['city'] }}"></select>
								<select name="city[district]" class="form-control" data-district="{{ $data->city['district'] }}"></select>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label label-width"><span class="text-danger">*</span> 详细地址：</label>
						<div class="col-sm-8 row">
							{!! Form::textarea('detail_address', null, ['class'=>'form-control len', 'rows'=>5, 'placeholder'=>'请您如实填写详细地址']) !!}
						</div>
					</div>	
				</div>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label label-width"></label>
			<div class="col-sm-8 row">
				{!! Form::submit('提交更新', ['class'=>'btn btn-primary btn-submit']) !!}
			</div>
		</div>
	{!! Form::close() !!}
	<!-- Modal -->
	<div class="modal fade" id="dialog-saler" tabindex="-1" role="dialog">
	  <div class="modal-dialog">
	    <div class="modal-content">
	        <div class="modal-header">
	            <button type="button" class="close" data-dismiss="modal" aria-label="true"><span aria-hidden="true">&times;</span></button>
	            <h4 class="modal-title">选择业务员</h4>
	        </div>
	        <div class="modal-body clearfix">
	        	<input type="text" class="form-control" v-model="word" placeholder="输入业务姓名搜索">
				<div class='salers-list mt15'>
					<a href='javascript:;' v-bind:class="{ 'active': saler==$key }" data-id="@{{ item.id }}" v-for="item in users | filterBy word">
					  @{{ item.name }}
					</a>
				</div>
	        </div>
	    </div>
	  </div>
	</div>
	<!-- Modal End -->
	</div>
@endsection

@section('foot')
<script src="{{ url('js/bootstrap-datetimepicker.js') }}"></script>
<script src="{{ url('js/distpicker/distpicker.data.min.js') }}"></script>
<script src="{{ url('js/distpicker/distpicker.js') }}"></script>
<script src="{{ url('js/nice-validator/jquery.validator.js?local=zh-CN') }}"></script>
<script type="text/javascript">
    // 时间选择器
    $('.datetimepicker-1').datetimepicker({
    	language: 'zh-CN',
    	autoclose: true,
    	weekStart: 1,
    	minView: 'month'
    });	

    $('.datetimepicker-2').datetimepicker({
    	language: 'zh-CN',
    	autoclose: true,
    	weekStart: 1,
    	minView: 'month'
    });

  	var salerLoadUrl = "{{ url('admin/salers-ajax') }}";
	var vm = new Vue({
		el: '#view',
		data: {
			saler: 0,
			name: '',
			users: [],
		}
	});

	$.getJSON(salerLoadUrl, function(data) {
		vm.users = data;
		vm.$set('name', data[vm.saler].name);
	});

	// 选择业务员
	$('#saler-select').on('click', function() {
		$('#dialog-saler').modal('show');
		return false;
	});

	$('.modal-body').on('click', '.salers-list a', function() {
		vm.$set('saler', $(this).data('id'));
		vm.$set('name', $(this).text());

		$('#dialog-saler').modal('hide');
	});

    $('.lan-list').on('click', 'li', function(e) {
    	if ($(this).hasClass('active')) {
    		$(this).removeClass('active');
    	} else {
    		$(this).addClass('active');
    	}
    });

	$.ajax({
	   type: "GET",
	   url: HOME_URL + "/admin/contract/customer/{{ $data->cid }}",
	   success: function(data) {
	   		var html = [];
	   		var time = '';
			$.each(data, function(key, value) {
				time = value.created_at.split(' ');
				html.push('<a href="javascript:;"><span>'+value.contract_no+'</span></a>');
			});	
			$('.contract-no-list').html(html.join(''));
	   }
	});

	$('.contract-no-list').on('click', 'a', function() {
		$("input[name='contract_no']").val($(this).find('span').text());
	});

</script>	
@endsection